<template lang="pug">
  .clearfix
    Modal(
      width="400"
      v-model="isShowBackModal"
      :title= "title"
      class-name="vertical-center-modal"
    )
      .search-form.mb-10.pr-10
        Form.ivu-row.ivu-form-basic(ref="formData" :model="formData" :rules="rules" :label-width="90")
          FormItem.form-item.ivu-col.pr-20.mb-25(v-for="(item, index) of formItem" :label="item.label" :key="index" :class="item.style" :prop="item.prop")
            template(v-if="item.type === 'input'")
              Input(v-model="formData[item.model]" :placeholder="item.placeholder" clearable)
            template(v-if="item.type === 'interval'")
              DatePicker.pull-left(v-model="formData[item.model]" :type="item.modal" :placeholder="item.placeholder" @on-change="handleChangeDatePicker" clearable)

      .clearfix(slot="footer")
        Button(type="text" @click="cancel") 取消
        Button(type="primary" @click="handleSubmit" :loading="!isCanSubmit") 确定
</template>

<script>
import { FinanceSSPayableApi } from '@/api/FinanceSSPayable.api.js'
import { FinanceTreatmentPayableApi } from '@/api/FinanceTreatmentPayable.api.js'
import { Common } from '@/utils/common.js'
export default {
  name: '',

  data () {
    return {
      title:'驳回',
      backType: -1,
      modalKey: null,
      modalType: null,
      isShowBackModal: false,
      formData: {
        remark: '',
        salaryTime: new Date(),
      },
      formItem: [
        { type: 'input', label: '驳回原因：', placeholder: '请输入驳回原因', prop: 'remark', model: 'remark', style: 'ivu-col-span-24' },
        { type: 'interval', label: '驳回时间：', placeholder: '请输入驳回时间', prop: 'salaryTime', model: 'salaryTime', style: 'ivu-col-span-24' },
      ],
      rules: {
        remark: [{ required: true, message: '请输入驳回原因' }],
        salaryTime: [{ required: true, message: '请输入驳回时间' }]
      },
      isCanSubmit: true,
      row: null,
      parentRow:null,
      datePickerDefault: new Date(), // 当前时间
    }
  },

  watch: {
  },

  mounted () {
  },

  methods: {
    cancel () {
      this.isShowBackModal = false
    },

    show (row,backType) {
      this.backType = backType
      this.row = row
      this.isCanSubmit = true
      this.isShowBackModal = true
      this.$refs.formData.resetFields()
      console.log(this.row,'row')
      this.title = backType ==-1 ? '驳回':'退回'
      if(this.backType == -2) {
        this.formItem = [
          { type: 'input', label: '退回原因：', placeholder: '请输入退回原因', prop: 'remark', model: 'remark', style: 'ivu-col-span-24' },
          { type: 'interval', label: '退回时间：', placeholder: '请输入退回时间', prop: 'salaryTime', model: 'salaryTime', style: 'ivu-col-span-24' },
        ],
        this.rules= {
          remark: [{ required: true, message: '请输入退回原因' }],
          salaryTime: [{ required: true, message: '请输入退回时间' }]
        }
      } else {
        this.formItem= [
          { type: 'input', label: '驳回原因：', placeholder: '请输入驳回原因', prop: 'remark', model: 'remark', style: 'ivu-col-span-24' },
          { type: 'interval', label: '驳回时间：', placeholder: '请输入驳回时间', prop: 'salaryTime', model: 'salaryTime', style: 'ivu-col-span-24' },
        ]
        this.rules= {
          remark: [{ required: true, message: '请输入驳回原因' }],
          salaryTime: [{ required: true, message: '请输入驳回时间' }]
        }
      }
    },

    async handleSubmit () {
      var params = {
        ID: this.row.id,
        status: this.backType,
        periodYear: this.row.periodYear,
        // EmployeeIDs: this.modalKey == 'fromList' ? null : this.parentSelectedId,
        BackTime: this.formData.salaryTime ? this.$moment(this.formData.salaryTime).format('YYYY-MM-DD') : '',
        BackRemark: this.formData.remark
      }
      if (this.modalKey != 'fromList') {
        params.SalaryBillIDs = this.parentSelectedId
      }
      console.log('params: ', params)
      var serverApi
      if (this.modalType === 'daiyuyingfu' || this.modalType === 'daiyushenqing') {
        serverApi = FinanceTreatmentPayableApi
      } else {
        serverApi = FinanceSSPayableApi
      }
      this.$refs.formData.validate((valid) => {
        if (valid) {
          console.log('驳回 提交表单', params)
          serverApi.back(params).then(res => {
            if (res.data.success) {
              this.isCanSubmit = false
              this.isShowBackModal = false
              this.$Message.success(res.data.message)
            } else {
              this.isCanSubmit = true
              this.$Message.error({
                content: res.data.message,
                duration: 10,
                closable: true
              })
            }
            this.$emit('query',this.parentRow)
          })
        }
      })
    },

    // 日期选择
    handleChangeDatePicker(val) {
      console.log("val: ", val);
    }
  }
}
</script>

<style lang="less" scope>
</style>
